<template>
    <div class="cu-tags theme-color-fff" >
        <el-radio-group v-model="tabPosition" @input="changeType">
            <el-radio-button v-for="(item, index) in tagsData" :label="item.value" :key="index"
                class="tab-item mg-r-10 radio-8">
                {{ item.title }}
            </el-radio-button>
        </el-radio-group>

    </div>
</template>
<script>
export default {
    name: 'tags',
    props: {
        tagsData: {
            type: Array,
            default: () => []
        },
        value: {
            type: Array,
            default: () => []
        },
        tabPositionFather: {
            type: String,
            default: '1'
        }

    },
    created() {

        if(this.tabPositionFather){
            this.tabPosition = this.tabPositionFather;
        }
    },
    watch: {
        tabPositionFather(val) {
            this.tabPosition = val;
        },
      
    },
  

    data() {
        return {
            tabPosition:'1',
        }
    },
    methods: {
        changeType(val) {

            this.$emit('changeType', val)
        }
    }
}
</script>

<style  lang="scss" >
.cu-tags{
    .el-radio-button:first-child .el-radio-button__inner {

        border: 1px solid #2f8cec;
    }

    .el-radio-button__inner {
        border: none;
        // border: 0 solid transparent !important;
        border: 1px solid #2f8cec;
        color: #2f8cec;
        border-radius: 6px !important;
        font-weight: 700;
        font-size: 16px;
        padding: 8px;
    }
}
</style>
